<template>
  <a-card :bordered="false" @submit="submit">
      <!-- 搜索区域 -->
      <a-form layout="horizontal">
        <a-row  justify="center">
          <a-col :md="12" :sm="24">
            <a-form-item
              label="扩展机构"
              :labelCol="{ span: 10 }"
              :wrapperCol="{ span: 14 }"
            >
              <a-select prop="signInstId" v-model="query.signInstId" default-value="Option1" @click.native="getInstIdOrganizationList()">
                <a-select-option value="">
                  -请选择-
                </a-select-option>
                <a-select-option v-for="item in signInstIdList" :key="item" :value="item.id">
                  {{ item.id }}-{{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="12" :sm="24">
            <a-form-item
              label="扩展经理姓名"
              :labelCol="{ span: 10 }"
              :wrapperCol="{ span: 14 }"
            >
              <a-input placeholder="请输入经理姓名" v-model="query.managerName"> </a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row type="flex" justify="center">
          <a-button type="primary" @click="search1">查询</a-button>
          <a-button style="margin-left: 8px" @click="reset">重置</a-button>
        </a-row>
      </a-form>
    <!-- 表格区域 -->
    <div class="section">
      <a-table
        ref="TableInfo"
        :columns="columns"
        :dataSource="source"
        :pagination="pagination"
        :loading="loading"
        :rowKey="
          (record , index) => {
            return index;
          }
        "
        @change="pageChange"
        @showSizeChange="pageChange"
        :rowSelection="{
          hideDefaultSelections:true,
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
          type:'radio',
        }"
      >
      </a-table>
    </div>
  </a-card>
</template>

<script>


export default {
  name: "MchntApplyOperation",
  data() {
    return {
      modalVisible: false,
      instId: "",
      query: {
        managerName:"",
        signInstType:"BANK",
        signInstId:"",
      },
      beanInfo: {},
      source: [],
      rules: {
        signInstId: [{required: true, message: "必填", trigger: "blur"}],
      },
      selectedInfo:{},
      selectedRowKeys: [],
      signInstIdList: [],
      loading: false,
      pagination: {
        pageNum: 1,
        pageSize: 10,
        pageSizeOptions: ["10", "20", "30", "40", "100"],
        defaultCurrent: 1,
        defaultPageSize: 10,
        showQuickJumper: true,
        showSizeChanger: true,
        showTotal: (total, range) =>
          `显示 ${range[0]} ~ ${range[1]} 条记录，共 ${total} 条记录`,
      },
      columns: [
        {
          title: "姓名",// 拼接areaName
          dataIndex: "managerName",
          width: 120,
        },
        {
          title: "手机号",
          dataIndex: "managerPhone",
          width: 120,
        },
        {
          title: "员工号",
          dataIndex: "managerId",
          width: 120,
        },
        {
          title: "收单机构",
          dataIndex: "remark1",
          width: 120,
        },
      ]
    };
  },
  methods: {
    warning(message) {
      const h = this.$createElement;
      this.$warning({
        title: '提示',
        content: h('div', {}, [
          h('p', message),
        ]),
        onOk() {},
      });
    },
    onSelectChange(selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys;
      this.selectedInfo = this.source[selectedRowKeys[0]];
    },
    handleChange(param) {
    },
    search1(){
      if(typeof this.query.signInstId === 'undefined' || this.query.signInstId === ''){
        this.warning("请先选择扩展机构");
        return ;
      }
      this.pagination.pageNum = this.pagination.defaultCurrent;
      this.pagination.pageSize = this.pagination.defaultPageSize;
      this.search();
    },
    async search(e) {

      try {
        const res = await this.$get("admin/merParam/managerInfo/list", {
          instId: this.instId,
          managerName:this.query.managerName,
          signInstType:this.query.signInstType,
          signInstId:this.query.signInstId,
          pageNum: this.pagination.pageNum,
          pageSize: this.pagination.pageSize,
        });
        this.source = res.data.rows;
        this.$set(this.pagination, "total", +res.data.total);
      } catch (e) {
        console.error(e);
      }
    },
    async setBeanInfo({...beanInfo},instId) {
      this.beanInfo = beanInfo;
      this.instId = instId;

      this.reset();
    },
    reset() {
      // 取消选中
      this.selectedRowKeys = [];
      // 重置分页
      this.pagination.pageNum = this.pagination.defaultCurrent;
      this.pagination.pageSize = this.pagination.defaultPageSize;
      this.$set(this.pagination, "total", 0);
      // 重置查询参数
      this.query = {};
      this.source = [];
    },
    async getInstIdOrganizationList() {
      try {
        const res = await this.$get("/admin/merParam/UpmpOrganization/instIdOrganizationSelect2List", {
          q:encodeURIComponent(`&${this.instId}`)
        });
        if (res.status === 200) {
          this.signInstIdList = res.data.results;
        }
      } catch (e) {
        console.error(e);
      }
    },
    async submit() {
      if(this.selectedRowKeys.length < 1){
        this.warning("请先扩展经理")
        return false;
      }
      this.beanInfo.managerId = this.selectedInfo.managerId;
      this.beanInfo.managerName = this.selectedInfo.managerName;
      this.beanInfo.managerPhone = this.selectedInfo.managerPhone;
      const params = {
        ...this.beanInfo,
        orgCode: this.selectedInfo.signInstId,
      };
      const res = await this.$post("/admin/merParam/mchntApplyInfo/edit", params);
      if (res.status === 200) {
        this.$message.success("保存成功！");
        return true;
      } else {
        this.$message.error(res.data.message);
        return false;
      }
    },
    pageChange(e) {
      this.pagination.pageNum = e.current;
      this.pagination.pageSize = e.pageSize;
      this.search();
    },
  },
};
</script>
<style lang="less" scoped>
@import "../../../../../static/less/Common";
</style>
